<div class="content-section implementation GridDemo clearfixes">
  <div class="mysearch">
    <ng-container *ngFor="let tab of tabs;let i = index">
      <button pButton type="button"  label="{{tab.label}}" (click)="changeTab(i)"></button>
    </ng-container>
  </div>
  <ng-container [ngSwitch]= tabIndex>
    <div class="contentInfo" *ngSwitchCase="0" >
      <form class="form-horizontal storage" [formGroup]="shelfForm"   >
        <p-panel >
          <p-header>
            <div class="ui-helper-clearfix">
              <span class="ui-panel-title" style="font-size:16px;display:inline-block;margin-top:2px"></span>
              <button class="save"  pButton type="button"  label="返回" (click)="goBack()"  > </button>
              <button class="save" pButton [ngStyle]="{'float':'right'}"   *ngFor="let optbutton of optButtons"  label="{{optbutton.label}}" (click)="complyOption(optbutton.status)"  ></button>
            </div>
          </p-header>
          <div class="ui-grid ui-grid-responsive ui-grid-pad ui-fluid" style="margin: 10px 0px">
            <div class="ui-g margin-bottom-1vw">
              <div class="ui-g-6 ui-md-2 ui-lg-1 ui-padding-10px text-right">
                <label >上架单号:</label>
              </div>
              <div class="ui-g-6 ui-md-6 ui-lg-4">
                <input  formControlName="sid"  name="sid"   type="text" pInputText   placeholder=""  readonly [(ngModel)]="detailData.sid">
              </div>
              <div class="ui-g-6 ui-md-6 ui-lg-3 text-right">
                <label >状态:</label>
              </div>
              <div class="ui-g-6 ui-md-6 ui-lg-4">
                <input  formControlName="status"  name="sid"   type="text" pInputText   placeholder=""  readonly [(ngModel)]="detailData.status">
              </div>
            </div>
            <div class="ui-g margin-bottom-1vw">
              <div class="ui-g-6 ui-md-2 ui-lg-1 text-right">
                <label >申请人:</label>
              </div>

              <div class="ui-g-6 ui-md-6 ui-lg-4">
                <input formControlName="creator"  type="text" pInputText  name="creator" placeholder=""
                       readonly class="cursor_not_allowed"  [(ngModel)]="detailData.applicant" />
              </div>

              <div class="ui-g-6 ui-md-6 ui-lg-3 text-right">
                <label >申请人组织:</label>
              </div>
              <div class="ui-g-6 ui-md-6 ui-lg-4">
                <input formControlName="creator_org" pInputText type="text"  name="startTime" [(ngModel)]="detailData.applicant_org" readonly   class="no-border"/>
              </div>
            </div>
            <div class="ui-g margin-bottom-1vw">
              <div class="ui-g-6 ui-md-6 ui-lg-1 ui-padding-10px text-right">
                <label >上架类型:</label>
              </div>
              <div class="ui-g-6 ui-md-6 ui-lg-4">
                <input formControlName="assetshelve_type" pInputText type="text"  name="startTime" [(ngModel)]="detailData.assetshelve_type"  readonly   class="no-border"/>
              </div>
              <div class="ui-g-6 ui-md-6 ui-lg-3 text-right">
                <label >部门审批人:</label>
              </div>
              <div class="ui-g-6 ui-md-6 ui-lg-4">
                <input formControlName="org_approver" pInputText type="text"  name="startTime" [(ngModel)]="detailData.approve"  readonly   class="no-border"/>
              </div>

            </div>
            <div class="ui-g margin-bottom-1vw" >
              <div class="ui-g-6 ui-md-6 ui-lg-1 text-right">
                <label ><span></span>计划上架时间:</label>
              </div>
              <div class="ui-g-6 ui-md-6 ui-lg-4">
                <input formControlName="assetshelve_plantime_begin" pInputText type="text"  name="startTime" [(ngModel)]="detailData.assetshelve_plantime_begin"  readonly   class="no-border"/>
              </div>
              <div class="ui-g-6 ui-md-6 ui-lg-3 text-right ">
                <label ><span></span>计划完成时间:</label>
              </div>
              <div class="ui-g-6 ui-md-6 ui-lg-4">
                <input formControlName="assetshelve_plantime_end" pInputText type="text"  name="startTime" [(ngModel)]="detailData.assetshelve_plantime_end"  readonly   class="no-border"/>
              </div>
            </div>
            <div class="ui-g margin-bottom-1vw">
              <div class="ui-g-6 ui-md-6 ui-lg-1 ui-padding-10px text-right">
                <label >预计使用周期:</label>
              </div>
              <div class="ui-g-6 ui-md-6 ui-lg-4">
                <input  formControlName="usage_time"  name="usage_time"   type="text" pInputText   placeholder="" [(ngModel)]="detailData.usage_time"  readonly>
              </div>
              <div class="ui-g-6 ui-md-6 ui-lg-3 text-right">
                <label ><span></span>计划上架区域:</label>
              </div>
              <div class="ui-g-6 ui-md-6 ui-lg-4">
                <input formControlName="assetshelve_location"  type="text" pInputText  name="inspectiondepartments" placeholder=""
                       readonly class="cursor_not_allowed"  [(ngModel)]="detailData.assetshelve_location" />
              </div>
            </div>
            <div class="ui-g margin-bottom-1vw">
              <div class="ui-g-6 ui-md-6 ui-lg-1 text-right">
                <label ><span></span>关联预占单号:</label>
              </div>
              <div class="ui-g-6 ui-md-6 ui-lg-4">
                <input formControlName="preoccupied_sid"  type="text" pInputText  name="inspectiondepartments" placeholder=""
                       readonly class="cursor_not_allowed"  [(ngModel)]="detailData.preoccupied_sid" />
              </div>
              <div class="ui-g-6 ui-md-6 ui-lg-3 ui-padding-10px text-right">
                <label >供应电极:</label>
              </div>
              <div class="ui-g-6 ui-md-6 ui-lg-4">
                <input formControlName="power_level"  type="text" pInputText  name="inspectiondepartments" placeholder=""
                       readonly class="cursor_not_allowed"  [(ngModel)]="detailData.power_level" />
              </div>
            </div>
            <div class="ui-g margin-bottom-1vw">
              <div class="ui-g-6 ui-md-6 ui-lg-1 text-right">
                <label ><span></span>上架原因:</label>
              </div>
              <div class="ui-g-6 ui-md-6 ui-lg-11">
                <textarea formControlName="assetshelve_reason" name="jianshu" pInputTextarea type="text" [(ngModel)]="detailData.assetshelve_reason" readonly></textarea>
              </div>
            </div>
            <div class="ui-grid-row margin-bottom-1vw">
              <div class="ui-grid-col-1 ui-padding-10px text-right">
                <label >执行人组织:</label>
              </div>
              <div class="ui-grid-col-4">
                <input formControlName="next_approver_org"  type="text" pInputText  name="inspectiondepartments" placeholder=""
                       readonly class="cursor_not_allowed"  [(ngModel)]="detailData.executor_org" />
              </div>
              <div class="ui-grid-col-3 text-right">
                <label >上架执行人:</label>
              </div>
              <div class="ui-grid-col-4">
                <input formControlName="next_approver"  type="text" pInputText  name="inspectiondepartments" placeholder=""
                       readonly class="cursor_not_allowed"  [(ngModel)]="detailData.executor" />
              </div>
            </div>
            <div class="ui-g margin-bottom-1vw" formGroupName="timeGroup">
              <div class="ui-g-6 ui-md-6 ui-lg-1 text-right">
                <label ><span>*</span>上架开始时间:</label>
              </div>
              <div class="ui-g-6 ui-md-6 ui-lg-4">
                <p-calendar
                  formControlName="startTime"
                  [showIcon]="true"
                  [locale]="zh"
                  [styleClass]="'schedule-add'"
                  dateFormat="yy-mm-dd"
                  [required]="true"
                  dataType="string"
                  [minDate]="nowDate"
                  [showTime]="true"
                  [showSeconds]="true"
                  [(ngModel)]="submitData.assetshelve_acttime_start" >
                </p-calendar>
                <div [hidden]="shelfForm.get(['timeGroup','startTime']).valid||shelfForm.get(['timeGroup','startTime']).untouched">
                  <div class="ui-message ui-messages-error ui-corner-all"  [hidden]="!shelfForm.hasError('required',['timeGroup','startTime'])">
                    <i class="fa fa-close"></i>
                    上架开始时间必填
                  </div>
                </div>
              </div>
              <div class="ui-g-6 ui-md-6 ui-lg-3 text-right ">
                <label ><span>*</span>上架结束时间:</label>
              </div>
              <div class="ui-g-6 ui-md-6 ui-lg-4">
                <p-calendar
                  formControlName="endTime"
                  [showIcon]="true" [locale]="zh" name="return_time"
                  [styleClass]="'schedule-add'" dateFormat="yy-mm-dd" [required]="true" dataType="string"
                  [minDate]="nowDate" [(ngModel)]="submitData.assetshelve_acttime_end"  [showTime]="true"
                  [showSeconds]="true"
                >
                </p-calendar>
                <div [hidden]="shelfForm.get(['timeGroup','endTime']).valid||shelfForm.get(['timeGroup','endTime']).untouched">
                  <div class="ui-message ui-messages-error ui-corner-all"  [hidden]="!shelfForm.hasError('required',['timeGroup','endTime'])" >
                    <i class="fa fa-close"></i>
                    计划完成时间必填
                  </div>
                </div>
                <div class="ui-message ui-messages-error ui-corner-all"  *ngIf="shelfForm.hasError('time','timeGroup')" >
                  <i class="fa fa-close"></i>
                  {{shelfForm.getError('time','timeGroup')?.descxxx}}
                </div>
              </div>
            </div>
          </div>
        </p-panel>
        <label></label>
        <label><span></span>待上架设备列表</label>
        <p-dataTable [value]="devices" (onLazyLoad)="loadCarsLazy($event)" [lazy]="true" [rows]="10" [paginator]="true"
                     [totalRecords]="totalRecords"  [(selection)]="selectConstructions" [editable]="true"   [rowsPerPageOptions]="[5,10,20]">
          <p-column [style]="{'width':'38px'}" selectionMode="multiple"></p-column>
          <p-column  field="ano" header="设备编号" [sortable]="true"  >
            <ng-template let-data="rowData" pTemplate="body" let-i="rowIndex">
              <span (click)="viewOption(data)" class="curser">{{data.ano}}</span>
            </ng-template>
          </p-column>
          <p-column  *ngFor="let col of cols" field="{{col.field}}" header="{{col.header}}" [editable]="col.editable" [sortable]="true"></p-column>
          <p-column  field="data" header="上架位置" [sortable]="true" >
            <ng-template let-data="rowData" pTemplate="body" let-i="rowIndex">
              <span>{{data['timeGroup']}}</span>
            </ng-template>
          </p-column>
          <p-column header="操作">
            <ng-template let-car="rowData" pTemplate="body" let-i="rowIndex">
              <button  pButton type="button"  label="编辑"  (click)="updateOption(dataSource[i],'update',i)"></button>
            </ng-template>
          </p-column>
          <ng-template pTemplate="emptymessage" >
            当前没有数据
          </ng-template>
        </p-dataTable>
      </form>
    </div>
    <div class="associatedEquipment" *ngSwitchCase="1" >
      <p-dataTable [value]="detailData.approval_process"  [lazy]="true" [rows]="10" [paginator]="true"
                   [totalRecords]="totalRecords"  [(selection)]="selectInsepections" >
        <!--<p-column [style]="{'width':'38px'}" selectionMode="multiple"></p-column>-->
        <p-column  *ngFor="let col of asscitedCols" field="{{col.field}}" header="{{col.header}}"></p-column>
        <ng-template pTemplate="emptymessage">
          当前没有数据
        </ng-template>
      </p-dataTable>
    </div>
    <div class="Operationlog" *ngSwitchCase="2">
      <p-dataTable [value]="detailData.operations"  [lazy]="true" [rows]="10" [paginator]="true"
                   [totalRecords]="totalRecords"  [(selection)]="selectInsepections" >
        <!--<p-column [style]="{'width':'38px'}" selectionMode="multiple"></p-column>-->
        <p-column  *ngFor="let col of OperationLogCols" field="{{col.field}}" header="{{col.header}}"></p-column>
        <ng-template pTemplate="emptymessage">
          当前没有数据
        </ng-template>
      </p-dataTable>
    </div>
  </ng-container>
</div>
<app-asset-detail
  *ngIf="showViewDetailMask"
  [currentAsset]="tempAsset"
  (closeDetailMask)="closeViewDetail($event)">
  ></app-asset-detail>
<app-shelf-add-or-update-devices
  *ngIf="showAddMask"
  [state]="state"
  (closeAddMask)="removeMask($event)"
  [currentAsset]="tempAsset"
  (updateDev)="updateShelf($event)"
>
</app-shelf-add-or-update-devices>
